<template>
<div>
  <Header></Header>
<div id="main">
    <!-- 轮播图 -->
    <div class="pic" style="height:400px">
     
      <swiper class="swiper" :options="swiperOptions" >
        <swiper-slide>
          <img src="../assets/shanshui/index_lunbo1.jpg" >
        </swiper-slide>
        <swiper-slide><img src="../assets/shanshui/index_lunbo2.jpg" ></swiper-slide>
        <swiper-slide><img src="../assets/shanshui/index_lunbo3.jpg" ></swiper-slide>
        <!-- 小圆点 -->
        <!-- <div class="swiper-pagination" slot="pagination"></div> -->
      </swiper>
    </div>
    <!-- 景区大致介绍 -->
    <div class="scenicDesc" >
      <div style="margin-bottom:30px">
        <div class="left">
          <div class="desc">
            <h2>本溪 · 简介</h2>
            <div style="width:270px">
              本溪素有“燕东胜境”之称，拥有“奇洞、名山、秀水、温泉、枫叶、民俗”六大名片，是东北抗联重要根据地，是国内极少数拥有自然和文化“双遗产”的城市，是中国优秀旅游城市、中国枫叶之都、中国温泉之城。
              桓仁五女山城是世界文化遗产，是高句丽的发祥地、清朝的肇兴地，享有“太子城”、“东北山城”、“盛京后花园”的美誉。本溪境内重峦叠嶂、连绵起伏，系长白山地老龄支脉、龙岗支脉的西南延续部分，海拔高度平均为350米左右。
              桓仁满族自治县境内的佛顶山主峰为全境的最高处，海拔为1367.78米，素有“辽宁屋脊”之称。
            </div>
          </div>
          <img src="../assets/shanshui/index1.jpg" alt="" />
        </div>
        <div class="right" style="width:430px;height:583px">
          <div class="time" style="width:430px">
            <div class="top" style="width:100%">
              <p>
                因疫情,现景区只接待辽宁省内游客及常驻本溪的外省游客,入景区必须携带本人身份证,请配合景区做好身份证查验,体温检测,佩戴口罩等防疫工作
              </p>
            </div>
            <div>
              <div>
                <p>06:00</p>
                <p>18:00</p>
              </div>
              <div>
                <p>开放时间</p>
                <p>结束时间</p>
              </div>
            </div>
          </div>
          <div class="benxi">
            <div class="ticket">
              <router-link to="/ticket"
                ><img src="../assets/qianshan/dingpiao.png"
              /></router-link>
              <div>
                <p>咨询电话</p>
                <p>0412-2576186</p>
                <p>服务时间 : 08:00-20:00</p>
              </div>
            </div>
            <div class="tips">
              <a href="">
                <img src="../assets/qianshan/s62c561aa6b0ba.png" alt="" />
                <span>交通路线</span>
              </a>
              <a href="">
                <img src="../assets/qianshan/s62c561959445d.png" alt="" />
                <span>游览须知</span>
              </a>
            </div>
          </div>
        </div>
      </div>
      <div class="introduce">
        <div class="jingqu">
          <div>
            <p>热门景区</p>
            <p>Popular scenic spots</p>
          </div>
          <ul>
            <li>
              <img src="../assets/shanshui/index_hgx.jpeg" alt="" />
              <div>
                <span>本溪虎谷峡</span>
                <span>¥40</span>
              </div>
            </li>
            <li>
              <img src="../assets/shanshui/index_wns.jpeg" alt="" />
              <div>
                <span>桓仁五女山</span>
                <span>¥40</span>
              </div>
            </li>
            <li>
              <img src="../assets/shanshui/index_wtd.jpg" alt="" />
              <div>
                <span>桓仁望天洞</span>
                <span>¥40</span>
              </div>
            </li>
            <li>
              <img src="../assets/shanshui/index_hgx.jpeg" alt="" />
              <div>
                <span>本溪虎谷峡</span>
                <span>¥40</span>
              </div>
            </li>
            <li>
              <img src="../assets/shanshui/index_wns.jpeg" alt="" />
              <div>
                <span>桓仁五女山</span>
                <span>¥40</span>
              </div>
            </li>
            <li>
              <img src="../assets/shanshui/index_wtd.jpg" alt="" />
              <div>
                <span>桓仁望天洞</span>
                <span>¥40</span>
              </div>
            </li>
          </ul>
          <!-- <a href="?page=scenic">了解更多</a> -->
        </div>
        <div class="culture">
          <div>
            <p>独特文化</p>
            <p>Original Religion Culture</p>
          </div>
          <ul>
            <li>
              <div>
                <h2>工艺</h2>
                <p>辽砚</p>
              </div>
              <img src="../assets/shanshui/index_cuaturl1.jpg" />
            </li>
            <li>
              <div>
                <h2>舞蹈</h2>
                <p>本溪朝鲜族乞粒舞</p>
              </div>
              <img src="../assets/shanshui/index_dance.jpg" />
            </li>
            <li>
              <div>
                <h2>工艺</h2>
                <p>满族剪纸</p>
              </div>
              <img src="../assets/shanshui/index_moyu.jpeg" />
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 总览 -->
    <div class="fourth">
      <router-link to="/service">
        <div class="ser choose">
          <img src="../assets/qianshan/i-5.png" alt="" />
          <h2>景区服务平台</h2>
        </div>
      </router-link>
      <router-link to="/museum">
        <div class="mu choose">
          <img src="../assets/qianshan/i-7.png" alt="" />
          <h2>特色产品</h2>
        </div>
      </router-link>
      <router-link to="/tikInfo">
        <div class="tikDir choose">
          <img src="../assets/qianshan/i-2.png" alt="" />
          <h2>票务指南</h2>
        </div>
      </router-link>
      <router-link to="/bussiness">
        <div class="buss choose">
          <img src="../assets/qianshan/i-6.png" alt="" />
          <h2>商务合作</h2>
        </div>
      </router-link>
    </div>
  </div>
  <Footer></Footer>

</div>
  
</template>

<script>
import Header from '../components/MyHeader.vue'
import Footer from '../components/MyFooter.vue'
export default {
  components:{
    Header,Footer
  },
  data() {
    return {
      swiperOptions:{
        // 页数指示点的配置
        pagination:{ el: ".swiper-pagination"},
        autoplay:{
          delay:3000,
          disableOnInteraction:false,
        }, //自动滚动
        loop:true, //循环滚动

      }
    };
  },
  methods: {
    
  },
};
</script>
<style scoped src="../assets/css/home.css"></style>

<style lang="scss" scoped>
.swiper-container {
  width: 1400px;
  height: 500px;
  margin: 10px auto;
}
</style>